<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>员工培训查询</title>
		<meta http-equiv="Pragma" CONTENT="no-cache">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="renderer" content="webkit">
		<link rel="stylesheet" href="${cxt!}/sb/plugins/ztree/css/zTreeStyle/zTreeStyle.css" type="text/css">
		<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
		<%include("/common/include.html"){}%>
	</head>
	
	<body class="easyui-layout">
			<div data-options="region:'north',split: true,title:'快速查询'" style="height:200px;padding:10px;">
				<form id="turnoverRatioJdrStatistic_Form"  method="post">
				    <div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">最早咨询日期：</label>
						<input name="startTime" id="startTime" value='${startTime !}' class="easyui-datebox theme-textbox-radius" style="height:32px;width:212px;text-align:center">
					</div>
					
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">最晚咨询日期：</label>
						<input name="endTime" id="endTime" value='${date()}' class="easyui-datebox theme-textbox-radius" style="height:32px;width:212px;text-align:center">
					</div>
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">店面名称：</label>
						<input id="organ" type="text" readonly style="width: 200px; height: 30px; padding-left: 10px;border-radius:3px" onclick="showMenu(); return false;" class="textbox" value="${organization.name! }"/>
						<input name="organIds" id="organIds" value="${organization.ids! }" type="hidden">
					</div>
					<div style="margin-bottom: 10px;float:left;margin-right: 10px;">
						<label class="label-top" style="width: 100%; display: block;">搜索</label>
						<a href="#" onclick="searchFrom()" class="easyui-linkbutton" data-options="iconCls:'icon-search'" style="height:32px;width:212px;text-align:center">搜索</a>
					</div>
					<div style="margin-bottom: 10px;float:left;margin-top: 16px;margin-right: 10px;">
						<a href="#" onclick='customerInfo_xls()' class="easyui-linkbutton" data-options="iconCls:'icon-pageexcel'" style="width:212px">导出</a>
					</div>
				</form>
			</div>
			<div data-options="region:'center',border: false" style="overflow-x:hidden;">
				<table id="turnoverRatioJdrStatistic_datagrid" class="easyui-datagrid" >
					<thead>	
						<tr>
							<th data-options="field:'jdrname',width:80,align:'center'" formatter='jdrclick'>接待人</th>
							<th data-options="field:'jdrids',width:80,hidden:true">接待人ids</th>
							<th data-options="field:'organids',width:80,hidden:true">机构ids</th>
							<th data-options="field:'organname',width:80,hidden:true">店名</th>
							<th data-options="field:'intonum',width:80,align:'center'" >进店人数</th>
							<th data-options="field:'dealnum',width:80,align:'center'" formatter='dealnumFormatter'>成交人数</th>     
							<th data-options="field:'nodealnum',width:80,align:'center'" formatter='nodealnumFormatter'>未成交人数</th>
							<th data-options="field:'dealratio',width:80,align:'center'" formatter='dealratioFormatter'>成交率</th>
							<th data-options="field:'reasonratio',width:80,align:'center'" formatter='reasonratioFormatter'>未成交原因占比</th>
						</tr>
					</thead>
				</table>	
							
			</div>
			<div id="menuContent" class="menuContent" style="display: none; position: absolute;z-index: 10;">
				<ul id="organSelectTree" class="ztree" style="margin-top:0;width: 200px;"></ul>
			</div>	
			<div id="reasonratio_window" class="easyui-window" title="未成交原因占比" style="width:50%;height:60%;"
					data-options="modal:false,closed:true">
					<div id="reasonratio_echarts" style="width:95%;height:80%;margin-top: 20px;"></div>
			</div>
			<script src="sb/js/statistic/turnoverRatioJdrStatistic/turnoverRatioJdrStatistic.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		function  jdrclick(value,row,index)
		{	
			var rows=$('#turnoverRatioJdrStatistic_datagrid').datagrid("getRows");
			if(index==rows.length-1)
			{
				return  value;
			}else{
				var jdrids=row.jdrids;
				var organids=row.organids;
				return '<a href="#" style="color: blue;" class="button-edit" onclick="lookReasonInfo(\''+jdrids+'\',\''+organids+'\')">' + value + '</a>';
			}
		}
		function dealnumFormatter(value,row)
		{
			if(value==null)
			{
				return  row.dealnum='0';
			}else
			{
				return  value;
			}
		}
		function nodealnumFormatter(value,row)
		{
			if(value==null)
			{
				return  row.nodealnum='0';
			}else
			{
				return  value;
			}
		}
		function  dealratioFormatter(value,row)
		{	var dealratio=0;
			if(row.dealnum!=0 && row.intonum!=0)
			{	
				dealratio=parseFloat(row.dealnum)/parseFloat(row.intonum)*100;
			}
			return  row.dealratio=dealratio.toFixed(2)+"%";
		}
		function  reasonratioFormatter(value,row)
		{
			var jdrids=row.jdrids;
			var organids=row.organids;
			return '<button href="#" style="height:25px;width:50px;background:#00A65A;color:white" onclick="lookReasonratio(\''+jdrids+'\',\''+organids+'\')">查看</button>';
		}
		
		</script>
		<script type="text/javascript">
			var setting = {
				async : {
					enable : true,
					url : '${cxt!}/common/getOrgenTree',
					autoParam : [ "id=ids" ],//, "name=n", "level=lv"
					type : "post"
				},
				view : {
					dblClickExpand : false
				},
				data : {
					simpleData : {
						enable : true
					}
				},
				callback : {
					onClick : onClick,
					onAsyncSuccess : organTreeOnAsyncSuccess
				}
			};
			var flag=0;//只初始化一次标识
			function organTreeOnAsyncSuccess(event, treeId, msg) {
				if(flag == 0){
					flag = 1;
				}
			}
			function onClick(e, treeId, treeNode) {
				var zTree = $.fn.zTree.getZTreeObj("organSelectTree");
				var path = "";
				var sNodes = zTree.getSelectedNodes();
				if (sNodes.length > 0) {
					var node = sNodes[0].getPath();
					for(var i =0;i<node.length;i++){
						if(i == (node.length-1)){
							path += node[i].name;
						}else{
							path += node[i].name + "/";
						}
						
					}
				}
				var cityObj = $("#organ");
				cityObj.attr("value", path);
				$("#organIds").attr("value", treeNode.id);
				hideMenu();
			}
			function showMenu() {
				var cityObj = $("#organ");
				var cityOffset = $("#organ").offset();
				$("#menuContent").css({
					left : cityOffset.left + "px",
					top : cityOffset.top + cityObj.outerHeight() + "px"
				}).slideDown("fast");
		
				$("body").bind("mousedown", onBodyDown);
			}
			function hideMenu() {
				$("#menuContent").fadeOut("fast");
				$("body").unbind("mousedown", onBodyDown);
			}
			function onBodyDown(event) {
				if (!(event.target.id == "menuBtn"
						|| event.target.id == "menuContent" || $(event.target)
						.parents("#menuContent").length > 0)) {
					hideMenu();
				}
			}
			$.fn.zTree.init($("#organSelectTree"), setting);
		</script>
		
	</body>
</html>
